<!--
 * @Description:
 * @Author bianpengfei
 * @create 2021/4/22 9:42
 -->
<template>
  <div>
    <div class="g-icon-refresh__wrap">
      <el-tooltip effect="dark" content="刷新一下" placement="top-start">
        <i class="el-icon-refresh" @click="onRefreshView"> </i>
      </el-tooltip>
    </div>
    <fullscreen v-model="isFullscreen"></fullscreen>
    <div class="g-version__wrap iconfont znz-icon-banben" :title="'版本'">
      <span>v{{ defaultConfig.application.version }} </span>
    </div>
    <el-dropdown class="g-avatar__wrap" trigger="hover">
      <span>
        <span class="jigou-name">{{ userInfo && userInfo.loginOrgan && userInfo.loginOrgan.name }}</span>
        <i class="iconfont-pc bpf-icon-touxiang g-avatar"></i>
        <span>{{ (userInfo && userInfo.cname_user) || '登录人' }} </span>
        <i class="el-icon-caret-bottom"></i>
      </span>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item @click.stop.native="onClearCache">清除缓存</el-dropdown-item>
        <el-dropdown-item @click.stop.native="onLogout">退出</el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>
    <div class="el-icon-setting g-el-icon-setting" @click.stop="onClickSetting"></div>
  </div>
</template>

<script>
import { get, sync, call } from 'vuex-pathify'
import Fullscreen from '../fullscreen'
import defaultConfig from '@/setting'
import { asyncTo } from '@bianpengfei/utils'
export default {
  name: 'Index',
  components: {
    Fullscreen
  },

  data() {
    return {
      isFullscreen: false,
      defaultConfig
    }
  },

  computed: {
    userInfo: get('user/info'),
    _layout: sync('app/layout'),
    _settingVisible: sync('app/settingVisible')
  },

  // mounted() {
  //   setTimeout(() => {
  //     Vue.prototype.$ELEMENT = { size: 'mini', zIndex: 3000 }
  //   }, 3000)
  // },

  methods: {
    userLogOut: call('user/loginOut'),

    /* 重新刷新router view*/
    onRefreshView(event) {
      const curDOM = event.target
      curDOM.style.transition = `${300}ms ease-in-out`
      curDOM.style.transform = `rotate(-360deg)`
      if (!this.$baseEventBus) return window.location.reload()
      // 当前页面
      this.$baseEventBus.$emit('reload-router-view')
      setTimeout(() => {
        curDOM.style.transition = `none`
        curDOM.style.transform = `rotate(0)`
      }, 300)
    },

    async onLogout() {
      const [res, err] = await asyncTo(
        this.$confirm('您确定要退出本系统?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
      )
      if (!err) {
        console.log('this', this)
        // this.$message.success({
        //   message: '删除成功!'
        // })
        await this.userLogOut()
        const redirect = `/backsys/login?redirect=${encodeURIComponent(this.$route.fullPath)}`
        this.$message.success('已成功退出')
        this.$router.replace(redirect)
      }
    },

    /* 点击setting*/
    onClickSetting() {
      this._settingVisible = !this._settingVisible
    },

    /**
     * 清除缓存
     */
    onClearCache() {
      clearLocalStorageExclude()
      this.$notify.success({
        title: '提示',
        message: '清除缓存成功',
        position: 'bottom-right'
      })
      window.location.reload()
    }
  }
}
</script>
